/**
 * Created by charsen on 16/5/27.
 */
directives.directive('resizeable', ["$rootScope", "tools", "$timeout", "$document", function ($rootScope, tools, $timeout, $document) {
    return {
        restrict: 'A',
        scope: false,
        link: function (scope, element, attr) {
            var $ele = $(element), moveX, moveY, pageX, pageY, height, mode, base_y, base_x;
            var $container = $('.charts-container');
            var container_width = $container.width();

            scope.resizing = false;

            $(element).delegate('b.point', 'mousedown', function (event) {
                var $tar = $(event.target);

                if ($tar.hasClass('rigt-mid')) {
                    mode = "right";
                } else if ($tar.hasClass('rigt-bom')) {
                    mode = "right-bottom";
                } else if ($tar.hasClass('cent-bom')) {
                    mode = "bottom";
                } else if ($tar.hasClass('rigt-top')) {
                    mode = "right-top";
                } else if ($tar.hasClass('cent-top')) {
                    mode = 'top-middle';
                } else if ($tar.hasClass('left-mid')) {
                    mode = "left-middle";
                } else if ($tar.hasClass('left-bom')) {
                    mode = 'bottom-left';
                } else if ($tar.hasClass('left-top')) {
                    mode = "top-left";
                }

                pageX = event.pageX;
                pageY = event.pageY;

                width = $ele.width();
                height = $ele.height();

                base_y = pageY + height;
                base_x = pageX + width;

                $document.on('mousemove', mousemove);
                $document.on('mouseup', mouseup);

                event.stopPropagation();
            });

            function mousemove (event) {
                moveX = event.pageX - pageX;
                moveY = event.pageY - pageY;
                width += moveX;
                height += moveY;

                pageX = event.pageX;
                pageY = event.pageY;

                scope.resizing = true;

                switch (mode) {
                    case 'right':
                        if ($ele.position().left > container_width - $ele.width() - 5) {
                            return;
                        }

                        $ele.css({
                            width: width + 'px'
                        });
                        break;
                    case 'bottom':
                        $ele.css({
                            height: height + 'px'
                        });
                        break;
                    case 'right-bottom':
                        if ($ele.position().left > container_width - $ele.width() - 3)
                            return;

                        $ele.css({
                            width: width + 'px',
                            height: height + 'px'
                        });
                        break;
                    case 'right-top':
                        if ($ele.position().top + moveY < 3)
                            return;

                        if ($ele.position().left > container_width - $ele.width() - 3)
                            return;

                        $ele.css({
                            width: width + 'px',
                            height: base_y - pageY + 'px',
                            top: $ele.position().top + moveY + 'px'
                        });
                        break;
                    case 'top-middle':
                        if ($ele.position().top + moveY < 3)
                            return;

                        $ele.css({
                            height: base_y - pageY + 'px',
                            top: $ele.position().top + moveY + 'px'
                        });
                        break;
                    case 'left-middle':
                        if ($ele.position().left + moveX < 3)
                            return;

                        $ele.css({
                            width: base_x - pageX + 'px',
                            left: $ele.position().left + moveX + 'px'
                        });
                        break;
                    case 'bottom-left':
                        if ($ele.position().left + moveX < 3)
                            return;

                        $ele.css({
                            width: base_x - pageX + 'px',
                            height: height + 'px',
                            left: $ele.position().left + moveX + 'px'
                        });
                        break;
                    case 'top-left':
                        if ($ele.position().left + moveX < 3)
                            return;

                        if ($ele.position().top + moveY < 3)
                            return;

                        $ele.css({
                            width: base_x - pageX + 'px',
                            height: base_y - pageY + 'px',
                            left: $ele.position().left + moveX + 'px',
                            top: $ele.position().top + moveY + 'px'
                        });
                        break;
                }

                if ($ele.position().top + $ele.height() > $container.height() - 50) {
                    borderExpand();
                }

                // 绘制辅助线
                scope.drawAuxiliaryLine(true, $ele);
            }

            function mouseup () {
                $document.off('mousemove', mousemove);
                $document.off('mouseup', mouseup);

                $rootScope.$broadcast('RESIZE_EV');

                if (scope.drawChart) {
                    scope.drawChart();
                }
                $timeout(function () {
                    scope.resizing = false;
                }, 50);

                scope.drawAuxiliaryLine(false);
            }

            function borderExpand () {
                $container.height($container.height() + 100);
            }
        }
    }
}]);